<template>
	<view class="parent-view">
		<view class="list-item">
			<image class="image-bg" :src="viewBg" mode="scaleToFill"></image>
			<view class="qr-view">
				<tki-qrcode ref="qrcode"
							:val="QrCode" 
							:size="170" 
							:onval="true"
							:icon="headIcon"
							iconSize="19"
							:loadMake="false"
							showLoading="true"
							loadingText="二维码生成中"
							:usingComponents="true"
							@result="qrR"/>
			</view>
		</view>
		<view class="btn-view">
			<text class="left-btn" @click="changeOne">换一张</text>
			<text class="right-btn" @click="saveImg">保存到相册</text>
		</view>
	</view>
</template>

<script>
	import request from '../index/request.js';
	import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue"
	export default {
		components: {
			tkiQrcode
		},
		data() {
			return {
				headIcon:"../../static/logo.png",
				src: '' ,// 二维码生成后的图片地址或base64
				QrCode:"",
				viewBg:"",
				position:0,
				viewBgList:[],
			}
		},
		methods: {
			onLoad: function(options) {
				this.appUtil.saveAppInviteId(options)
				this.getQrCodeBG()
				this.getQrCode()
			},
			
			onShow:function(){
				this.share.url='/pages/tabBar/home/index?appInviteId='+this.appUtil.getAppInviteId()
				this.share.shareType=1
			},
			changeOne:function(){
				if(this.position<this.viewBgList.length-1){
					this.position++
				}else{
					this.position=0
				}
				this.viewBg = this.viewBgList[this.position].url
			},
			getQrCodeBG:function(){
				var that=this
				request.post("api/common/getqrcodetemplate", {
					code:"SQ_qrcode_img"
				}).then(data => {
					that.viewBgList=data
					that.viewBg = data[that.position].url
				})
			},
			
			getQrCode:function(){
				var that=this
				request.post("api/user/statistics_cash", {
				}).then(data => {
					that.QrCode = data.qrcodecontent
				})
			},
			saveImg:function(){
				this.$refs.qrcode._saveCode()
			},
			qrR:function(res) {
				this.src = res
			},
		}
	}
</script>

<style>
	@import "index.css";
</style>
